import React, { Component } from 'react'

export class Alert extends Component {
  render() {
      const {showAlert,close,list,checkIndex,changTabs,checkList,checkSpan,delets} =this.props;
      console.log(this.props)
    return (
      <div>
          {
              showAlert ?
              <div className="box">
                  <span onClick={()=>{
                      this.props.close()
                  }}>X</span>

                <div  className='checkbox'>
                  {
                      checkList.length ?
                      checkList.map((item,index)=>{
                          return <div key={index}>{item} <span onClick={()=>{
                            this.props.delets(index)
                          }}>X</span></div>
                      }):'暂无数据'
                  }
                </div>

                 <div className='tops'>
                 {
                      list.length ?
                      list.map((item,index)=>{
                        return <div key={index} className={checkIndex==index?'act':''} onClick={()=>{
                            this.props.changTabs(index)
                        }}>{item.title}</div>
                      }):'暂无数据'
                  }
                 </div>
                  <div className='centens'>
                  {
                      list[checkIndex].children.length ?
                      list[checkIndex].children.map((item,index)=>{
                        return <div key={index} onClick={()=>{
                            this.props.checkSpan(index)
                        }}>{item}</div>
                      }):'暂无数据'
                  }
                  </div>
                </div>:
             null
          }
          {/* {showAlert} */}
      </div>
    )
  }
}

export default Alert